@import "@/common/constants/StyleConst.scss";

.tasks-container {
  margin-bottom: 2.4%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;

  .v-toolbar__content {
    .toolbar-left {
      display: flex;
      flex-direction: column;
      text-align: left;
      min-width: 0;
      position: relative;
      top: 26px;

      .card-title {
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        padding: 0;
      }

      .toolbar-subtitle {
        padding: 0;
        height: 24px;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        position: relative;
        top: -4px;
        font-size: 9px;
      }

      .container-title {
        flex-direction: column;
        position: relative;
        top: 8px;

        .toolbar-title {
          align-self: flex-start;
          font-size: 1rem;
          font-weight: bold;
          color: #556282;
        }

        .itemDetail-header {
          height: 12px;
          padding-left: 0;
        }

        .itemDetail-header>b {
          margin: 0 4px;
        }

        .itemDetail-header>b:first-child {
          margin-left: 0;
        }
      }
    }

    .toolbar-right {
      min-width: 140px;

      .toolbar-right-btn {}

      .toolbar-right-progress {
        display: flex;
        flex-direction: row;
        justify-content: flex-end;

        .progress-linear {
          max-width: 88px;
          border-radius: 8px;
          margin-right: 4px;
        }
      }
    }
  }
}